<template>
    <div class="w100 f-grow" :class="showFooter ? 'p20' : ''">
        <div class="f16 fw5 fam mb20 h-start-center">
            <div class="apply-item-icon mr15"></div>
            基本信息审核
        </div>
        <a-form-model
            :model="form"
            ref="form"
            :rules="rules"
            :colon="false"
            class="m-form-model"
            labelAlign="left"
            layout="vertical"
        >
            <a-row type="flex" justify="start" :gutter="40">
                <a-col :span="12" class="mb16" v-for="(item, index) in list" :key="index">
                    <a-form-model-item :label="item.label" :prop="item.key">
                        <a-input
                            v-if="item.formType === 'input'"
                            autoComplete="off"
                            :placeholder="'请输入' + item.label"
                            v-model.trim="form[item.key]"
                            :disabled="item.disabled"
                            allowClear
                        />
                        <a-select
                            v-if="item.formType === 'select'"
                            autoComplete="off"
                            :placeholder="'请输入' + item.label"
                            v-model.trim="form[item.key]"
                            :disabled="item.disabled"
                            allowClear
                        >
                            <a-select-option
                                v-for="(option, optionIndex) in item.options"
                                :value="option.value"
                                :key="option.label + optionIndex"
                            >
                                {{ option.label }}
                            </a-select-option>
                        </a-select>
                        <el-date-picker
                            :disabled="item.disabled"
                            size="small"
                            v-if="item.formType === 'year'"
                            v-model="form[item.key]"
                            @blur="timeChange"
                            type="year"
                            format="yyyy年"
                            value-format="yyyy"
                            placeholder="选择年"
                        ></el-date-picker>
                    </a-form-model-item>
                </a-col>
            </a-row>
        </a-form-model>
        <Footer
            v-if="showFooter"
            @save="save"
            @back="back"
            :isShowSave="isShowSave"
            @previousStep="previousStep"
            @nextStep="nextStep"
            :isShowNext="true"
            :isShowPrevious="true"
        ></Footer>
        <div v-else class="h-end-center">
            <a-button class="mr20" @click="modelClose">取消</a-button>
            <a-button :loading="modalLoading" class="mr20" type="primary" @click="save">确定</a-button>
        </div>
    </div>
</template>

<script>
import mixin from './mixin'
import { baseInfoModify } from '@/common/api/setting'
export default {
    mixins: [mixin],
    props: {
        list: {
            type: Array,
        },
        showFooter: {
            type: Boolean,
            default: true, // 为false时用于基本信息修改
        },
        applyNeedData: {},
    },
    data() {
        return {
            form: {},
            rules: {},
            modalLoading: false,
        }
    },
    mounted() {
        setTimeout(() => {
            this.init()
        }, 100)
    },
    methods: {
        timeChange(val) {
            this.form = { ...this.form }
        },
        init() {
            let form = {}
            const rules = {}
            if (this.record?.applyBaseVO) {
                form = this.record?.applyBaseVO
            }
            this.list.forEach((item, index) => {
                form[item.key] = form[item.key]
                if (this.showFooter) {
                    form.applyYear = this.record.applyYear
                }
                rules[item.key] = [
                    {
                        trigger: 'blur',
                        message: '该项未填写',
                        required: true,
                    },
                ]
            })
            this.form = form
            this.rules = rules
        },
        modelClose() {
            this.$emit('update:showModal', false)
        },
        async saveApi() {
            this.modalLoading = true

            if (!this.showFooter) {
                try {
                    let res = await baseInfoModify(this.form)
                    if (res.code == 200) {
                        this.$message.success(res.message)
                        this.modelClose()
                    }
                } catch (e) {
                    console.log(e)
                }
            } else {
                try {
                    let res = await this.applyApi.baseInfo({ applyYear: this.form.applyYear, id: this.record.id })
                    if (res.code == 200) {
                        this.$message.success(res.message)
                    }
                } catch (e) {
                    console.log(e)
                }
            }
            this.modalLoading = false
        },
    },
}
</script>

<style lang="scss" scoped></style>
